From 1cef356be95a67f95d40f5b0b131f98d11f13c13 Mon Sep 17 00:00:00 2001
From: Martin Kagamino Lehoux <martin@lehoux.net>
Date: Sat, 12 Sep 2026 22:22:33 +0200
Subject: Extract Button primitive, migrate all call sites

Variants primary/accent/ghost/done with scoped styles.
Disabled handling unified; block/size/style props cover
login stretch, done-lg, save-check positioning.
Delete btn-* globals and dead page overrides.
---
 .../[projectId]/routine/[routineId]/+page.svelte   | 29 +++++++---------------
 1 file changed, 9 insertions(+), 20 deletions(-)

(limited to 'src/routes/projects/[projectId]/routine/[routineId]/+page.svelte')

diff --git a/src/routes/projects/[projectId]/routine/[routineId]/+page.svelte b/src/routes/projects/[projectId]/routine/[routineId]/+page.svelte
index 74880cb..867719a 100644
--- a/src/routes/projects/[projectId]/routine/[routineId]/+page.svelte
+++ b/src/routes/projects/[projectId]/routine/[routineId]/+page.svelte
@@ -3,6 +3,7 @@
 	import HealthChart from '$lib/components/HealthChart.svelte';
 	import ScoreBadge from '$lib/components/ScoreBadge.svelte';
 	import StatusBadge from '$lib/components/StatusBadge.svelte';
+	import Button from '$lib/components/Button.svelte';
 	import {
 		formatFrequency,
 		parseIntervalToDays,
@@ -111,16 +112,15 @@
 			{#if frequency !== '' && frequencyDays === null}
 				<p class="error">Intervalle invalide — ex : 1d, 2w, 3m, 1y</p>
 			{/if}
-			<button
-				class="btn-primary btn-save"
-				type="submit"
+			<Button
 				disabled={!name.trim() || frequencyDays === null}
+				style="position: relative; padding-right: 2.75rem;"
 			>
-				<span class="btn-save-label">Enregistrer</span>
-				<span class="btn-save-check" class:visible={saved} aria-hidden="true"
+				<span>Enregistrer</span>
+				<span class="save-check" class:visible={saved} aria-hidden="true"
 					>✓</span
 				>
-			</button>
+			</Button>
 		</form>
 	{/if}
 
@@ -170,7 +170,7 @@
 				placeholder="Note (optionnel)"
 				autocomplete="off"
 			/>
-			<button class="btn-done btn-done-lg" type="submit">Fait</button>
+			<Button variant="done" size="lg">Fait</Button>
 		</form>
 	{/if}
 
@@ -259,12 +259,6 @@
 		flex: 1;
 	}
 
-	.btn-done-lg {
-		padding: 0.75rem 1.25rem;
-		border-radius: 0.75rem;
-		font-size: 0.9375rem;
-	}
-
 	.completion-row {
 		flex-wrap: wrap;
 		gap: 0.25rem 0.75rem;
@@ -298,12 +292,7 @@
 		color: var(--danger);
 	}
 
-	.btn-save {
-		position: relative;
-		padding-right: 2.75rem;
-	}
-
-	.btn-save-check {
+	.save-check {
 		position: absolute;
 		right: 1rem;
 		top: 50%;
@@ -312,7 +301,7 @@
 		transition: opacity 0.2s ease;
 	}
 
-	.btn-save-check.visible {
+	.save-check.visible {
 		opacity: 1;
 	}
 </style>
-- 
cgit v1.3